import { IPlank } from '@/types';
import { Typography } from 'antd';
import { PropsWithChildren, ReactNode } from 'react';

export function InfoCard({ children }: PropsWithChildren) {
  return <div className="p-2 divide-y bg-gray-50">{children}</div>;
}
export function InfoItem({
  label,
  value,
}: {
  label: ReactNode;
  value: ReactNode;
}) {
  return (
    <div className="flex justify-between py-1 text-right">
      <span className="flex-shrink-0 mr-1 text-secondary">{label}</span>
      <Typography.Paragraph
        className="!m-0"
        ellipsis={{ tooltip: value, rows: 2 }}
        strong
      >
        {value}
      </Typography.Paragraph>
    </div>
  );
}

export function PlankBaseInfo(props: { plank?: IPlank }) {
  const { plank } = props;
  return (
    <div>
      <InfoItem label="板件名称" value={plank?.name} />
      <InfoItem label="板件编码" value={plank?.code} />
      <InfoItem
        label="板件类型"
        value={plank && (isRectPlank(plank) ? '矩形板件' : '异形板件')}
      />
      <InfoItem label="板件厚度" value={plank?.thickness} />
    </div>
  );
}

export function isRectPlank(plank: IPlank) {
  return !plank.finishedProfile;
}
